<template>
    <div>
        <Card :title="copyFormData.pageTitle"
              :bordered="false"
              dis-hover
              class="ivu-mt">
            <Form ref="formData"
                  :model="formData"
                  :rules="copyFormDataRules"
                  :label-width="140">
                <Row>
                    <Col span="18"
                         offset="3"
                         v-for="(item, index) in copyFormData"
                         :key="index">
                    <component :itemData="item.data"
                               :formData.sync="formData"
                               v-bind:is="item.fileName"
                               @handleChangeFormData="handleChangeFormData"></component>
                    </Col>
                    <Col span="18"
                         offset="3">
                    <FormItem>
                        <Button type="primary"
                                @click="handleSubmit('formData')">提交</Button>
                        <Button @click="handleReset('formData')"
                                class="ivu-ml-8">清空</Button>
                    </FormItem>
                    </Col>
                </Row>
            </Form>
        </Card>
    </div>
</template>
<script>
    import forms from '@/mixins/dynamicFormAdd'; // 混入通用代码
    import qwSelectTree from '@/components/common/formItem/qwSelectTree'; // selectTree组件
    import qwInput from '@/components/common/formItem/qwInput'; // input组件
    import qwSelect from '@/components/common/formItem/qwSelect'; // select组件
    import qwDatePicker from '@/components/common/formItem/qwDatePicker'; // 时间组件
    import qwUpload from '@/components/common/formItem/qwUpload'; // upload组件
    import qwCascader from '@/components/common/formItem/qwCascader'; // 级联组件
    import qwRadio from '@/components/common/formItem/qwRadio'; // 单选组件
    import qwCheckbox from '@/components/common/formItem/qwCheckbox'; // 多选组件
    import qwQuill from '@/components/common/formItem/qwQuill'; // 多选组件

    export default {
        mixins: [forms],
        components: { qwSelectTree, qwInput, qwDatePicker, qwSelect, qwUpload, qwCascader, qwRadio, qwCheckbox, qwQuill },
        data () {
            return {
            }
        },
        methods: {

            // 获取初始配置信息
            getConfigData () {
                this.pagePath = this.$route.path;
                let dynamicData = require('./configjs/reasonMangeAdd').default;
                this.requestApi = dynamicData.requestApi; // 页面所需接口集合
                this.$set(this.$data, 'dynamicData', dynamicData);

                // copy 一份数据 方便清空表单数据
                let copyFormData = JSON.parse(JSON.stringify(this.dynamicData.formData));
                let copyFormDataRules = JSON.parse(JSON.stringify(this.dynamicData.formDataRules));
                // 传给子组件的数据
                this.copyFormData = copyFormData;
                this.copyFormDataRules = copyFormDataRules;

                // 动态添加formData 提交数据内容
                copyFormData.forEach(item => {
                    const obj = item.data;
                    let name = '';
                    let val = '';
                    if (obj.type === 'inputRange' || obj.type === 'inputNumberRange') {
                        obj.valueArr.forEach(item => {
                            name = item.name;
                            val = item.value;
                            this.$set(this.formData, name, val)
                        })
                    } else {
                        name = obj.name;
                        val = obj.value;
                        this.$set(this.formData, name, val)
                    }
                });
            }
        }
    }
</script>
